<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Blob Demo - PageForest Sample Application</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="/lib/0/js/utils.js"></script>
<script type="text/javascript" src="blobdemo.js"></script>
<script type="text/javascript">
var blobdemo = namespace.lookup("com.pageforest.blobdemo");
$(document).ready(blobdemo.documentReady);
</script>
</head>
<body>
<h1><script>document.write(document.title)</script></h1>
<table style="float:left">
<tr>
<th><label for="id_doc_id">Doc ID:</label></th>
<td><input id="id_doc_id" name="doc_id" value="doc" type="text" /></td>
</tr>
<tr>
<th><label for="id_doc">Doc:</label></th>
<td><textarea id="id_doc" name="doc" style="width:400px; height:100px">
{
"title": "My Document",
"tags": ["test"],
"readers": ["public"],
"writers": ["authenticated"]
}
</textarea></td>
</tr>
<tr>
<th></th>
<td>
<input type="button" onclick="blobdemo.signIn()" value="Sign In" />
<input type="button" onclick="blobdemo.signOut()" value="Sign Out" />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="button" onclick="blobdemo.docAjax('PUT')" value="Put" />
<input type="button" onclick="blobdemo.docAjax('GET')" value="Get" />
<input type="button" onclick="blobdemo.docAjax('DELETE')" value="Delete" />
<input type="button" onclick="blobdemo.docAjax('HEAD')" value="Head" />
</td>
</tr>
</table>

<table style="float:left">
<tr>
<th><label for="id_key">Key:</label></th>
<td><input id="id_key" type="text" name="key" value="key" /></td>
</tr>
<tr>
<th><label for="id_value">Value:</label></th>
<td><textarea id="id_value" name="value" style="width:400px; height:100px">
{
"value": 123
}
</textarea></td>
</tr>
<tr>
<th></th>
<td>
<input type="button" onclick="blobdemo.blobAjax('PUT')" value="Put" />
<input type="button" onclick="blobdemo.blobAjax('GET')" value="Get" />
<input type="button" onclick="blobdemo.blobAjax('DELETE')" value="Delete" />
<input type="button" onclick="blobdemo.blobAjax('HEAD')" value="Head" />
</td>
</tr>
</table>

<div id="results" style="clear:both"></div>
</body>
</html>
